<template>
  <div class="audition190">
    <p>回调地狱：回调函数中嵌套回调函数，一直重复嵌套下去，很难维护。</p>
    <p>Promise语法糖：async / await</p>
    <p>链式调用的核心逻辑：</p>
    <v-md-preview :text="text1" />
    <p>打印结果：</p>
    <img src="@images/promise4.png" alt="" class="img">
    <p>可以看到，调用<span class="color">.then()</span>后，</p>
    <p>返回的是一个Promise，状态为<span class="color">fullfilled</span>，结果为<span class="color">1</span></p>
    <p>这个状态和结果会一直往下传，当前then生成的promise会传给下一个then。</p>
  </div>
</template>

<script>
const prefix = '``` js'
const suffix = '```'
export default {
  name: 'Audition190',
  data() {
    return {
      text1: `${prefix}
      var p = new Promise((resolve, reject) => {
        resolve(1)
      })
      console.log(p.then())
      \n${suffix}`,
    }
  }
}
</script>

<style>

</style>